<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>后台管理</title>
    <meta name="description" content="后台管理">
    <meta name="keywords" content="后台管理">
    <meta content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" name="viewport">
    <link rel="stylesheet" href="../css/global.css">
    <link rel="stylesheet" href="../plugins/elementui/index.css">
    <link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="../css/main.css">
</head>
<body>
<div id="app" class="main-container" style="height: 100%">
    <el-header class="main-header">
        <a href="#" class="logo" style="text-align:center">
            <img src="../img/logo.png" alt="">
            <span>后台管理</span>
        </a>
        <div class="header-right">
            <el-dropdown class="avatar-container" @command="handleCommand">
                <div class="avatar-wrapper">
                    <img src="../img/user2-160x160.jpg" class="user-avatar" alt="">
                    <span>Admin</span>
                </div>
                <el-dropdown-menu slot="dropdown">
                    <el-dropdown-item command="exit">退出</el-dropdown-item>
                </el-dropdown-menu>
            </el-dropdown>
        </div>
    </el-header>
    <el-container style="height: calc(100% - 60px)">
        <el-aside width="200px">
            <el-menu :router="true">
                <el-submenu v-for="menu in menuList" :index="menu.path">
                    <template slot="title">
                        <i  :class="menu.icon"></i>
                        <span>{{menu.title}}</span>
                    </template>
                    <template v-for="child in menu.children">
                        <el-menu-item :index="child.path"  @click="handleRoute(child.path)">
<!--                            <a :href="child.linkUrl" target="right">{{child.title}}</a>-->
                            {{child.title}}
                        </el-menu-item>
                    </template>
                </el-submenu>
            </el-menu>
        </el-aside>
        <el-main style="padding: 0">
            <iframe ref="iframe" name="right" class="el-main" style="padding: 0" src="user.html" width="100%" height="100%"
                    frameborder="0"></iframe>
        </el-main>
    </el-container>
</div>
</body>
<!-- 引入组件库 -->
<script src="../plugins/vue/vue.js"></script>
<script src="../plugins/elementui/index.js"></script>
<script type="text/javascript" src="../plugins/jquery/jquery.min.js"></script>
<script>
  new Vue({
    el: '#app',
    data: {
      menuList: [
        // {
        //   "path": "1",
        //   "title": "工作列表",
        //   "icon": "fa-dashboard",
        //   "children": []
        // },
        {
          "path": "2",
          "title": "系统管理",
          "icon": "el-icon-menu",
          "children": [
            {
              "path": "user.html",
              "title": "用户管理",
              "linkUrl": "user.html",
              "children": []
            },
            {
              "path": "role.html",
              "title": "角色管理",
              "children": []
            },
            // {
            //   "path": "/2-2",
            //   "title": "体检资料上传",
            //   "children": []
            // },
            // {
            //   "path": "/all-item-list.html",
            //   "title": "会员信息统计",
            //   "linkUrl": "all-item-list.html",
            //   "children": []
            // },
          ]
        },
        {
          "path": "3",
          "title": "预约管理",
          "icon": "el-icon-menu",
          "children": [
            // {
            //   "path": "/3-1",
            //   "title": "预约信息列表",
            //   "linkUrl": "ordersettinglist.html",
            //   "children": []
            // },
            // {
            //   "path": "/3-2",
            //   "title": "预约条件设置",
            //   "linkUrl": "ordersetting.html",
            //   "children": []
            // },
            // {
            //   "path": "/3-3",
            //   "title": "套餐信息管理",
            //   "linkUrl": "setmeal.html",
            //   "children": []
            // },
            {
              "path": "checkgroup.html",
              "title": "检查组管理",
              "linkUrl": "checkgroup.html",
              "children": []
            },
            {
              "path": "checkitem.html",
              "title": "检查项管理",
              "linkUrl": "checkitem.html",
              "children": []
            },
          ]
        },
        // {
        //   "path": "4",
        //   "title": "健康评测",
        //   "icon": "fa-stethoscope",
        //   "children": [
        //     {
        //       "path": "/4-1",
        //       "title": "中医体质辨识",
        //       "linkUrl": "all-medical-list.html",
        //       "children": []
        //     },
        //   ]
        // },
        // {
        //   "path": "5",
        //   "title": "统计分析",
        //   "icon": "fa-heartbeat",
        //   "children": [
        //     {
        //       "path": "/5-1",
        //       "title": "套餐统计",
        //       "linkUrl": "report_setmeal.html",
        //       "children": []
        //     },
        //     {
        //       "path": "/5-2",
        //       "title": "会员统计",
        //       "linkUrl": "report_member.html",
        //       "children": []
        //     },
        //     {
        //       "path": "/5-2",
        //       "title": "统计报告",
        //       "linkUrl": "report_business.html",
        //       "children": []
        //     }
        //   ]
        // }
      ]
    },
    methods: {
      handleCommand(command) {
        window.location.href = '../index.html'
      },
      handleRoute(url){
        this.$refs.iframe.src = url;
      }
    }
  });
</script>
</html>
